<template>
  <FPage>
    <div class="form-process-done-list-search-wrapper">
      <el-form ref="searchForm" status-icon inline
               :rules='[]' :model="searchParams">
        <el-form-item prop="title" label="流程标题">
          <el-input v-model="searchParams.title" placeholder="请输入标题"/>
        </el-form-item>

        <el-form-item style="padding-left: 10px">
          <el-button icon="search" round type="primary" @click="search">搜索</el-button>
          <el-button icon="reload" round @click="resetQueryParams">重置</el-button>
          <el-button icon="remove" round type="warning" :disabled="isEmpty(selectedRows)"
                     @click="removeUserTaskByIds">删除</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="form-process-done-list-table-wrapper">
      <el-table height="100%" border stripe :default-sort="sortConfig" @row-click="rowClick"
                :data="dataSource" @sort-change="sortChange" @selection-change="selectionChange"
                class="form-process-todo-list-table" v-loading="loading">
        <el-table-column type="selection" width="40"/>

        <el-table-column show-overflow-tooltip sortable prop="title" label="标题"/>
        <el-table-column show-overflow-tooltip sortable prop="userTaskName" label="流程节点"/>
        <el-table-column show-overflow-tooltip sortable prop="createTime" label="接收时间"/>
        <el-table-column show-overflow-tooltip sortable prop="sponsorUsername" label="发起人"/>
        <el-table-column show-overflow-tooltip sortable prop="sponsorTime" label="发起时间"/>
        <el-table-column show-overflow-tooltip sortable prop="formShowName" label="单据名称"/>
      </el-table>
    </div>

    <div class="form-process-done-list-footer-wrapper">
      <el-pagination
          v-model:current-page="pagination.current"
          v-model:page-size="pagination.size"
          :page-sizes="pageOptions"
          background layout="total, sizes, prev, pager, next, jumper"
          :total="pagination.total" small
          @size-change="search"
          @current-change="pageChange"
      />
    </div>
  </FPage>
</template>

<script setup>
import './style.css';
import {defineExpose, getCurrentInstance, reactive, ref, onMounted, unref} from 'vue';
import TableSearchUtils from '@/utils/TableSearchUtils';
import {getViewActionId, isEmpty} from '@/utils/CommonUtils';
import {deleteAction, getAction} from '@/request/BaseRequest';
import {ElMessageBox} from 'element-plus';
import FPage from '@/components/layout/FPage.vue';

const props = defineProps({formId: undefined});
const searchForm = ref(undefined);
const searchParams = reactive({
  title: undefined
});
const internalInstance = getCurrentInstance();
let global = internalInstance.appContext.config.globalProperties;

function toApprove(rowData) {
  let viewActionId = getViewActionId(rowData);
  let url = `/plat/work/approve?viewActionId=${viewActionId}&businessId=${rowData.businessId}&userTaskId=${rowData.userTaskId}&fullScreen=1`;
  global.$windowManager.open(url, {
    close: search
  });
}

onMounted(() => {
  search();
})

function onRowClick(rowData) {
  toApprove(rowData);
}

function onSelection() {

}

function doSearch(searchData) {
  getAction('/plat/collaborate/todo/page', searchData).then(data => {
    if (data.success) {
      let result = data.result;
      setSearchResult(result);
    }
  });
}

function removeUserTaskByIds() {
  if (isEmpty(selectedRows)) return;
  let list = unref(selectedRows);
  let ids = list.map(item => item.id);
  if (isEmpty(ids)) return;
  ids = ids.toString();
  if (isEmpty(ids)) return;

  ElMessageBox.confirm('删除后不可恢复, 确定删除吗', '确定删除?', {
    draggable: true,
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning',
  }).then(() => {
    deleteAction('/flow/removeUserTaskByIds', {ids}).then(data => {
      if (data.success) {
        search();
      }
    });
  }).catch(() => {
  });
}

const {
  loading, rowClick, search, selectionChange, setSearchResult, pageOptions, pageChange,
  sortChange, dataSource, resetQueryParams, sortConfig, selectedRows, pagination
} = TableSearchUtils({
  refForm: searchForm,
  doSearch,
  defaultSortConfig: {
    prop: 'createTime',
    order: 'descending',
  },
  searchParams,
  selectionChange: onSelection,
  rowClick: onRowClick
});

defineExpose({
  search
});

</script>
